<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>10_Promise的几个关键问题3</title>
</head>

<body>
  <!-- 
    Promise实例.then() 返回的是一个【新的Promise实例】, 它的值 和 状态由什么决定?
        1. 简单表达: 由 then() 所指定的回调函数的执行结果决定
        2. 详细表达:
            (1). 如果 then所指定的回调返回的是 【非Promise值】
              那么 新Promise实例 的状态为: 成功(fulfilled), 成功的value为【非Promise值】
            (2). 如果 then所指定的回调返回的是一个 【Promise实例】
              那么 新Promise实例 的状态、值, 都与  【Promise实例】 一致.
            (3). 如果 then所指定的回调抛出异常:
              那么 【新 Promise实例】 的状态为 rejected, reason为抛出的那个异常
  -->

  <script>
    // #region 验证: then所指定的回调返回的是 【非Promise值】
    // 那么 新Promise实例 的状态为: 成功(fulfilled), 成功的value为【非Promise值】
    // const p = new Promise((resolve,reject) => {
    //   setTimeout(() => {
    //     resolve('a');
    //   }, 1000);
    // });

    // const x = p.then(
    //   (value) => { 
    //     console.log('成功了1:', value);
    //     return 123;
    //   },
    //   (reason) => { console.log('失败了2:', reason) }
    // );

    // x.then(
    //   (value) => { console.log('成功了2:', value) },
    //   (reason) => { console.log('失败了2:', reason) }
    // );
    // #endregion


    // #region 验证: then所指定的回调返回的是一个 【Promise实例】
    // 那么 新Promise实例 的状态、值, 都与 【Promise实例】 一致
    // const p = new Promise((resolve,reject) => {
    //   setTimeout(() => {
    //     resolve('a');
    //   }, 1000);
    // });

    // const x = p.then(
    //   (value) => { 
    //     console.log('成功了1:', value);
    //     // return Promise.reject('b');
    //     // return Promise.resolve('b');
    //   },
    //   (reason) => { console.log('失败了2:', reason) }
    // );

    // x.then(
    //   (value) => { console.log('成功了2:', value) },
    //   (reason) => { console.log('失败了2:', reason) }
    // );
    // #endregion


    // #region 验证:  then所指定的回调抛出异常:
    // 那么 【新 Promise实例】 的状态为 rejected, reason为抛出的那个异常
    // const p = new Promise((resolve,reject) => {
    //   setTimeout(() => {
    //     resolve('a');
    //   }, 1000);
    // });

    // const x = p.then(
    //   (value) => { 
    //     console.log('成功了1:', value);
    //     throw new Error('出错了');
    //   },
    //   (reason) => { console.log('失败了2:', reason) }
    // );

    // x.then(
    //   (value) => { console.log('成功了2:', value) },
    //   (reason) => { console.log('失败了2:', reason) }
    // );
    // #endregion


    // #region 演示: then的链式调用
    // const p = new Promise((resolve, reject) => {
    //   setTimeout(() => {
    //     resolve('a');
    //   }, 1000);
    // });
    // p.then(
    //   (value) => { 
    //     console.log('成功了1:', value);
    //     return Promise.reject('b');
    //   },
    //   (reason) => { 
    //     console.log('失败了1:', reason);
    //     return Promise.resolve('b');
    //   },
    // ).then(
    //   (value) => {
    //     console.log('成功了2:', value);
    //     return true;
    //   },
    //   (reason) => {
    //     console.log('失败了2:', reason);
    //     return false;
    //   },
    // ).then(
    //   (value) => {
    //     console.log('成功了3:', value);
    //     throw 100;
    //   },
    //   (reason) => {
    //     console.log('失败了3:', reason);
    //     return 100;
    //   },
    // ).then(
    //   (value) => {
    //     console.log('成功了4:', value);
    //   },
    //   (reason) => {
    //     console.log('失败了4:', reason);
    //   },
    // ).then(
    //   (value) => {
    //     console.log('成功了5:', value);
    //   },
    //   (reason) => {
    //     console.log('失败了5:', reason);
    //   },
    // )
    // #endregion

  </script>
</body>

</html>
